<template>
	<uni-nav-bar title="福利发放" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<view class="package_sale datas" style="padding:10rpx;">
		<uni-datetime-picker v-model="range" type="daterange" :border="false" :clear-icon="false" rangeSeparator="至"
			@change="change" />
	</view>
	<scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="scroll-box animation-slide-right"
		:style="{ height: pageHeight + 'px' }">
		<view class="package_sale" v-for="(item,index) in orderLists"
			@click="navTo('Sale/Information/orderDetail?id='+item.id)" :style="{marginTop:index==0?'0px':'15rpx'}">
			<view class="numbers" @click.stop="copyText(item.order_sn)">单号：{{item.order_sn}}</view>
			<view class=" space-between list" v-for="items in item.goods_list" :key="items.goods_id">
				<image :src="items.image" mode=""></image>
				<view class="direction-start" style="height:153rpx;justify-content:space-between;width:76%;">
					<view class="title">{{items.name}}</view>
					<view class="space-between" style="width:100%;">
						<view v-if="items.type==='gem'" style="font-size: 26rpx;color:#5097FB;">
							蓝宝石
							<text style="font-size: 38rpx;margin-left: 10rpx;">{{items.score}}</text>
						</view>
						<view v-else style="font-size: 26rpx;color:#FE3B2E;">
							钱包价格:<text style="font-size: 24rpx;">￥</text>
							<text style="font-size: 38rpx;margin-left: 10rpx;">{{items.money}}</text>
						</view>
						<view class="text">({{item.driver_name}})</view>
					</view>
					<view class="space-between" style="width:100%;">
						<view></view>
						<view style="font-size: 26rpx;">x{{items.nums}}</view>
					</view>
				</view>
			</view>
			<view style="margin-top: 20rpx;color:#666;font-size: 28rpx;" class="center">
				查看更多订单信息
				<uni-icons type="right" size="15"></uni-icons>
			</view>
		</view>
		<Popu v-if="orderLists.length<1" :pageHeight="pageHeight" text="暂无福利发放"></Popu>
	</scroll-view>
	<view @click="ScanCode()" class="but">扫一扫</view>
</template>

<script setup lang="ts">
	import { navBack, navTo } from '@/utils/navigator';
	import { copyText } from '@/utils/copyText';
	import Popu from '@c/earthPushing/common/popu.vue';
	import { format, subDays } from 'date-fns';
	import { ref } from 'vue';
	import { onShow } from '@dcloudio/uni-app';
	import { scanQRCode } from '@/utils/wechat.jssdk';
	import { getHexiaoLog } from '@/gql/earthPushing/order';
	import { toPublish, } from '@mqtt';
	import { getDriverID } from '@/stores/driverID';
	const staff_id = getDriverID();
	// data
	const now = new Date();
	let end = format(now, 'yyyy-MM-dd');
	const daysAgo = subDays(now, 6);
	let start = format(daysAgo, 'yyyy-MM-dd');
	const range = ref([start, end]);

	const orderID = ref()
	const orderLists = ref([]);
	const isLoading = ref(false);
	const lastPage = ref(1);
	const currentPage = ref(1);
	const pageHeight = ref();
	uni.getSystemInfo({
		success: function (res) {
			pageHeight.value = res.windowHeight - 180;
		},
	});
	onShow(() => {
		currentPage.value = 1;
		orderLists.value = [];
		init()
	})
	function init() {
		isLoading.value = true;
		const payload = {
			query: getHexiaoLog,
			variables: {
				page: currentPage.value,
				staff_id,
				start,
				end,
			},
		};
		toPublish(
			'ql/staff/getHexiaoLog',
			payload,
			(obj : any) => {
				const { getHexiaoLog } = obj.data;
				isLoading.value = false;
				orderLists.value = [...orderLists.value, ...getHexiaoLog.list];
				lastPage.value = getHexiaoLog.lastpage;
			},
		);
	}
	/**
	 * 加载更多
	 */
	function loadMore() {
		if (currentPage.value < lastPage.value) {
			currentPage.value++;
			init();
		}
	}
	/**
	 * 赛选时间段
	 * @param currentPage  当前获取加注页数
	 * @param orderLists  清空加注订单列表
	 * @param start  赛选开始时间
	 * @param end  赛选结束时间
	 * @return 再次获取加注订单
	 */
	function change([sta, en]) {
		currentPage.value = 1;
		orderLists.value = [];
		start = sta;
		end = en;
		init();
	}
	// 核销
	function ScanCode() {
		// navTo('Sale/Information/addWriteOff?id=' + 35)
		// return
		scanQRCode((res : any) => {
			orderID.value = res.resultStr.split('score_order_')[1];
			if (orderID.value) {
				navTo('Sale/Information/addWriteOff?id=' + orderID.value)
			} else {
				alert('请扫描正确的二维码');
			}
		});
	}
</script>

<style scoped lang="less">
	.numbers {
		padding-bottom: 20rpx;
		box-sizing: border-box;
		border-bottom: 1px solid #eee;
		margin-bottom: 20rpx;
	}

	.list {
		image {
			width: 153rpx;
			height: 153rpx;
			border-radius: 5px;
		}
	}

	.title {
		width: 100%;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.text {
		width: 40%;
		text-align: right;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.but {
		width: 360rpx;
		height: 98rpx;
		background: #558AF1;
		border-radius: 5px;
		color: #fff;
		text-align: center;
		line-height: 98rpx;
		margin: 20rpx auto;
	}
</style>
<style>
	.datas>>>.uni-input-input {
		font-size: 32rpx !important;
	}

	.datas>>>.uni-date-x {
		font-size: 30rpx !important;
	}

	.datas>>>.uni-icons {
		font-size: 48rpx !important;
	}
</style>